function getRem(prem, pwidth) {
	var html = document.getElementsByTagName("html")[0];
	var oWidth = $(window).width()||document.body.clientWidth || document.documentElement.clientWidth;
	html.style.fontSize = oWidth / pwidth * prem + "px";
	return oWidth / pwidth * prem;
}
//getW
function getW(num) {
	return num * w / 1080;
}
var mapChart = null, //地图实例对象
	w = null, //屏幕宽度
	geoCoordMap = { //地图活动地点
		"平桥乡": [116.477622,31.752716],
		"分路口镇": [116.351422,31.751801],
		"苏埠镇": [116.374979,31.630139],
		"南楼村农家书屋": [116.372888,31.602369],
		"单王乡": [116.505242,32.007845],
		"韩摆渡镇": [116.345055,31.696235],
		"独山镇": [116.238449,31.613339],
		"江家店镇": [116.293987,31.824026],
		"青山乡": [116.399627,31.568884],
		"狮子岗乡": [116.264096,31.699806],
		"顺河镇": [116.484774,31.924127],
		"罗集乡": [116.251878,31.930476],
		"石板冲乡": [116.335231,31.610506],
		"固镇镇": [116.326268,32.017064],
		"石婆店镇": [116.152549,31.675721],
		"新安镇": [116.505234,31.870198],
		"西市街道": [116.491535,31.752913],
		"城南镇": [116.476195,31.69423],
		"西河口乡": [116.281947,31.562947],
		"丁集镇": [116.354319,31.943055],
		"鼓楼街道": [116.49846,31.757034],
		"徐集镇": [116.361542,31.833541],
		"小华山街道": [116.504862,31.732953],
	},
	convertData=null,
	len = Object.keys(geoCoordMap).length, //活动地点个数
	colorArr = ['#35fa6d', '#ff0024', '#fff'],
	colorIndex = 0,
	globalOption = null,
    arr = [], //保存需要轮播的seriesIndex
	timer = null,
	arrIndex = 0, //轮播标记index
	tooltip_timer=null,////提示框动效定时器变量
	waitCountNum=0;//提示框动效索引

//提示框dom
var str = '<div class="mapTip">' +
	'<p class="tipTitle shadow_text"></p>' +
	'<p class="line_2 shadow_text">' +
	'<span class="pre">开馆时间:</span>' +
	'<span class="pre_target">8:00-18:00</span>' +
	'</p>' +
	'<p class="line_3 shadow_text">' +
	'<span class="pre">地址:</span>' +
	'<span class="pre_target">惠州市惠阳区金惠大道惠州市惠阳区金惠大道7号</span>' +
	'</p>' +
	'</div>';
//CCEBEB
//获取图表配置参数
function getOption() {
	var op = {
		color: colorArr,
		title: {
			show: true,
			//text: '裕安区文广新局公共图书大数据平台',
			top: getW(100),
			right: getW(50),
			textStyle: {
				color: "#fff",
				fontSize: getW(50),
				textShadowColor: "#000",
				textShadowBlur: getW(30)
			}
		},
		tooltip: {
			show: true,
			trigger: 'item',
			confine: true,
			backgroundColor: 'transprent',
			//triggerOn : 'none',
			alwaysShowContent: true,
			formatter: function(a) {
				return str;
			}
		},
		geo: {
			map: 'myMap',
			zoom: 0.55,
			label: {
				emphasis: {
					show: false
				}
			},
			selectedMode: true,
			itemStyle: {
				normal: {
					//areaColor: 'rgba(204,235,235,.5)',
					color: {
						type: 'linear',
						x: 0,
						y: 0,
						x2: 0,
						y2: 1,
						colorStops: [{
							offset: 0, color: 'rgba(4, 48, 103, 0.92)' // 0% 处的颜色

						}, {
							offset: 1, color: 'rgba(4, 48, 103, 0.4)' // 100% 处的颜色

						}],
						globalCoord: false // 缺省为 false
					},
					borderColor: '#8ad5f9',
					borderWidth: getW(2),
					shadowBlur: getW(50),
					shadowColor: '#8ad5f9'
				},
				emphasis: {
					//areaColor: '#CCEBEB'
					areaColor: 'rgba(204,235,235,.5)',
				}
			},
			layoutCenter: ['40%', '50%'],
			// 如果宽高比大于 1 则宽度为 100，如果小于 1 则高度为 100，保证了不超过 100x100 的区域
			layoutSize: getW(950)
		},
		series: [],
	}
	$.each(geoCoordMap, function(i, ele) {
		arr.push(i)
		var item = {
			name: i,
			type: 'scatter',
			coordinateSystem: 'geo',
			data: convertData([{
				name: i,
				value: 9
			}]),
			symbol: 'circle',
			symbolSize: getW(15),
			symbolKeepAspect: true,
			label: {
				normal: {
					show: true,
					position: "top",
					formatter: function(a) {
						return '';
					}
				},
				emphasis: {
					show: false
				}
			},
			itemStyle: {
				color: colorArr[colorIndex]
			}
		}
		op.series.push(item);
		colorIndex++;
		if(colorIndex >= 3) colorIndex = 0;
	});
	return op;
};
$(function(){
	//屏幕尺寸自适应
	getRem(100, 1080);
	//屏幕宽度
	w = $(window).width();
	//实例化地图
	mapChart = echarts.init(document.getElementById('map'));
	convertData = function(data) {
		var res = [];
		for(var i = 0; i < data.length; i++) {
			var geoCoord = geoCoordMap[data[i].name];
			if(geoCoord) {
				res.push(geoCoord.concat(data[i].value));
			}
		}
		return res;
	};
	$.get('preview/json/yuAn.json', function(result) {
		//画图前的loading
		mapChart.showLoading();
		//注册地图为myMap
		echarts.registerMap('myMap', result);


		/*
		 * 具体活动地点数据数组
		 * index = 0 -->经度
		 * index = 1 -->纬度
		 * index = 2 -->具体值
		 */

		globalOption = getOption();
		mapChart.setOption(globalOption,true);
		mapChart.hideLoading();
		tooltipMove();///初始化调用一次
		toolTipAction();///循环调用动效
	})
})
//屏幕缩放
window.onresize = function() {
	getRem(100, 1080);
	w = $(window).width();
	h = $(window).height();
	getOption();
	mapChart.setOption(globalOption, true);
	mapChart.resize();
};

//产生随机rgb颜色
function randomColor() {
	return "rgb(" + Math.floor(Math.random() * 256) + ',' + Math.floor(Math.random() * 256) + ',' + Math.floor(Math.random() * 256) + ")";
}

//tip轮播函数
function toolTipAction() {
	if(!!window.tooltip_timer)	cancelAnimationFrame(window.tooltip_timer);
	if(waitCountNum >= 360){///6秒重复一次动效
		waitCountNum = 0;
		tooltipMove();
	}
	waitCountNum++;
	window.tooltip_timer = requestAnimationFrame(toolTipAction);
}
function tooltipMove(){
	if(arrIndex >= len) {
		arrIndex = 0;
	}
	var downIndex = arrIndex == 0 ? arr.length - 1 : arrIndex - 1; //需要取消高亮的上一个轮播标记index
	var newOption = globalOption;
	newOption.series[arrIndex].symbol = 'image://preview/img/arrow.png';
	newOption.series[arrIndex].symbolSize = getW(25);
	if(arrIndex == 0) {
		newOption.series[downIndex].symbol = 'circle';
		newOption.series[downIndex].symbolSize = getW(15);
	} else {
		newOption.series[arrIndex - 1].symbol = 'circle';
		newOption.series[arrIndex - 1].symbolSize = getW(15);
	}
	mapChart.setOption(newOption, true);
	//切换toolTip
	mapChart.dispatchAction({
		type: 'showTip',
		seriesIndex: arrIndex,
		dataIndex: 0
	})
	//切换toolTip的同时 加上高亮
	mapChart.dispatchAction({
		type: 'highlight',
		seriesIndex: arrIndex,
		dataIndex: 0
	})
	//当前高亮 上一个取消高亮
	mapChart.dispatchAction({
		type: 'downplay',
		seriesIndex: downIndex,
		dataIndex: 0
	})
	mapChart.on("rendered", function() {
		$(".wrap").find(".tipTitle").text(arr[arrIndex])
	})
	arrIndex++;
	if(arrIndex >= len) {
		arrIndex = 0;
	}

}